.main {
  // height: 100%;
  padding-bottom: 1.33rem;
  // padding: 0 0.933333rem 0 0.56rem;
  .myinfo-container {
    position: relative;
    // padding-bottom: 50px;
    margin: 0 auto;
    header {
      .header-self {
        position: relative;
        background-color: #144aaf;
        height: 3.333333rem;
        .return-img {
          position: absolute;
          top: 0.33rem;
          left: 0.56rem;
          height: 0.44rem;
          width: 0.44rem;
          background: url('../../images/common/sprites.png') no-repeat -52px -17px / 375px 475px;
        }
        p {
          height: 1.17rem;
          font-size: 0.43rem;
          font-family: SourceHanSansCN-Regular;
          line-height: 1.17rem;
          color: rgba(255, 255, 255, 1);
          text-align: center;
        }
        .self-photo {
          position: absolute;
          left: 50%;
          top: 50%;
          width: 3.25rem;
          height: 3.25rem;
          background-color: #99d7e8;
          transform: translateX(-50%);
          border-radius: 50%;

          &::after {
            position: absolute;
            right: 0.28rem;
            bottom: 0.36rem;
            content: '';
            width: 0.97rem;
            height: 0.97rem;
            border: 1px solid rgba(255, 255, 255, 1);
            background: rgba(242, 164, 16, 1) url('../../images/common/sprites.png') no-repeat -150px -303px /
              375px 475px;
            border-radius: 50%;
          }
          a {
            position: absolute;
            top: 0.5rem;
            left: 0.45rem;
            width: 2.35rem;
            height: 2.35rem;
            background: #cccccc url('../../images/common/sprites.png') no-repeat -237px -387px /
              375px 475px;
            border-radius: 50%;
          }
        }
      }
      .header-hello {
        box-sizing: border-box;
        // padding: 1.53rem 1.53rem 0;
        padding-top: 1.53rem;
        background-color: #edf1f2;
        height: 5.41rem;
        .hello {
          margin-bottom: 0.6rem;
          text-align: center;
          color: #b4b4b8;
          h2 {
            height: 0.68rem;
            font-size: 0.51rem;
            font-family: SourceHanSansCN-Regular;
            line-height: 0.68rem;
            color: rgba(136, 141, 148, 1);
            opacity: 1;
          }
          p {
            font-size: 0.36rem;
            font-family: SourceHanSansCN-Regular;
            line-height: 0.47rem;
          }
        }
        .red-packet {
          display: flex;
          padding: 0 1.11rem;
          height: 2.15rem;
          color: #acb1b7;
          .red-packet-left {
            flex: 1;
            border-right: 1px dashed #acb1b7;
            .red-packet-left-title {
              height: 1.12rem;
              font-size: 0.49rem;
              font-family: SourceHanSansCN-Regular;
              color: rgba(103, 108, 115, 1);
              letter-spacing: -4px;
              span {
                font-size: 0.84rem;
              }
            }
            .red-packet-left-text {
              padding-left: 0.47rem;
              height: 0.49rem;
              font-size: 0.37rem;
              font-family: SourceHanSansCN-Regular;
              line-height: 0.47rem;
              color: rgba(151, 157, 164, 1);
            }
          }
          .red-packet-right {
            flex: 1;
            .red-packet-right-title {
              text-indent: 1.07rem;
              height: 1.12rem;
              font-size: 0.84rem;
              font-family: SourceHanSansCN-Regular;
              line-height: 1.12rem;
              color: rgba(103, 108, 115, 1);
              letter-spacing: -4px;
              span {
                font-size: 0.37rem;
              }
            }
            .red-packet-right-text {
              text-align: center;
              height: 0.49rem;
              font-size: 0.37rem;
              font-family: SourceHanSansCN-Regular;
              line-height: 0.47rem;
              color: rgba(151, 157, 164, 1);
            }
          }
        }
      }
    }

    section {
      .section-order {
        font-size: 0.4rem;

        ul {
          display: flex;
          padding-top: 0.65rem;
          box-sizing: border-box;
          li {
            flex: 1;
            text-align: center;
            a {
              display: block;
              height: 1.12rem;
              width: 0.88rem;
              background: url('../../images/common/sprites.png') no-repeat;
              background-size: 375px 475px;
              margin: 0 auto;
            }
            &:nth-child(1) {
              a {
                background-position: -22px -354px;
              }
            }
            &:nth-child(2) {
              a {
                background-position: -79px -354px;
              }
            }
            &:nth-child(3) {
              a {
                background-position: -134px -354px;
              }
            }
            &:nth-child(4) {
              a {
                background-position: -192px -354px;
              }
            }
          }
          p {
            height: 0.49rem;
            font-size: 0.36rem;
            font-family: SourceHanSansCN-Regular;
            line-height: 0.56rem;
            color: rgba(103, 108, 115, 1);
          }
        }
      }
      .section-mine {
        ul {
          padding: 0.85rem 0.96rem 0 0.85rem;
          li {
            position: relative;
            margin-bottom: 0.8rem;
            .icon {
              position: absolute;
              top: -7px;
              left: 0;
              width: 0.79rem;
              height: 0.79rem;
              background: url('../../images/common/sprites.png') no-repeat;
              background-size: 375px 475px;
            }
            &:nth-child(1) {
              .icon {
                background-position: -22px -418px;
              }
            }
            &:nth-child(2) {
              .icon {
                background-position: -79px -418px;
              }
            }
            &:nth-child(3) {
              .icon {
                background-position: -136px -418px;
              }
            }
            &:nth-child(4) {
              .icon {
                background-position: -193px -418px;
              }
            }
            a {
              font-size: 0.4rem;
              color: black;
              height: 0.6rem;
              line-height: 0.6rem;
              padding-left: 1rem;
            }
            .icon-go {
              position: absolute;
              top: -5px;
              right: 0;
              width: 0.41rem;
              height: 0.71rem;
              background: url('../../images/zhao/icon/chevron_right.png') no-repeat center;
              background-size: cover;
            }
          }
        }
      }
    }
  }
}
